<template>
  <el-dialog append-to-body :title="title" width="640px" :visible="visible" @close="handleClose">
    <el-form :model="form" :rules="rules" label-suffix="：" ref="form">
      <el-form-item :label="commentLabel" prop="reason" class="white-card">
        <el-input v-model="form.reason" show-word-limit maxlength="1000" placeholder="请输入详细描述" type="textarea" style="width: 100%; height: 150px"></el-input>
      </el-form-item>
    </el-form>
    <div class="split"></div>
    <div class="dialog-footer-btn">
      <el-button @click="handleClose" type="primary" plain>关闭</el-button>
      <el-button @click="handleSubmit" :loading="submitting" type="primary">确定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import * as workOrderApi from "@/api/workOrder/index";
import * as mixins from "@/utils/mixins";

export default {
  name: "addSupervisionStatus",
  mixins: [mixins.loading, mixins.form, mixins.dialog],
  props: ["visible", "workOrder", "type"],
  data() {
    return {
      submitting: false,
      form: {
        reason: "",
      },
      rules: {
        reason: [{ required: true, message: "请填写" }],
      },
      optionList: [],
    };
  },
  computed: {
    title() {
      return ["发起跟踪", "解除跟踪", "解除异常", "发起异常", "编辑跟踪", "编辑异常"][this.type - 1];
    },
    commentLabel() {
      return ["跟踪事由", "解除备注", "解除备注", "异常事由", "跟踪事由", "跟踪事由"][this.type - 1];
    },
  },
  watch: {
    type() {
      if (this.type === 2) {
        this.$nextTick(() => {
          this.form.reason = "该案件跟踪事项已办理完毕，经研判，取消跟踪状态。";
        });
      }
      if (this.type === 5) {
        this.$nextTick(() => {
          this.form.reason = this.workOrder.supervisionReasons;
        });
      }
      if (this.type === 6) {
        this.$nextTick(() => {
          this.form.reason = this.workOrder.exceptionReasons;
        });
      }
    },
  },
  methods: {
    handleSubmit() {
      this.validateAndConfirm("form", "确定提交吗？")
        .then(() => {
          this.submitting = true;
          let workOrderMsg = { workOrderNo: this.workOrder.workOrderNo };
          console.log();
          return [
            // 添加跟踪
            () =>
              workOrderApi.process.addSupervision({
                ...workOrderMsg,
                supervisionReasons: this.form.reason,
              }),
            // 关闭跟踪
            () =>
              workOrderApi.process.cancelSupervision({
                ...workOrderMsg,
                cancelSupervisionReasons: this.form.reason,
              }),
            // 关闭异常
            () =>
              workOrderApi.all.closeException({
                ...workOrderMsg,
                cancelException: this.form.reason,
              }),
            // 添加异常
            () =>
              workOrderApi.process.addException({
                ...workOrderMsg,
                supervisionReasons: this.form.reason,
              }),
            // 编辑跟踪
            () =>
              workOrderApi.process.editSupervision({
                ...workOrderMsg,
                supervisionReasons: this.form.reason,
              }),
            // 编辑异常
            () =>
              workOrderApi.process.editException({
                ...workOrderMsg,
                supervisionReasons: this.form.reason,
              }),
          ][this.type - 1]();
        })
        .then(() => {
          this.$emit("success");
          this.handleClose();
        })
        .finally(() => (this.submitting = false));
    },
  },
};
</script>

<style lang="less" scoped>
.tips {
  text-align: center;
  margin-bottom: 20px;
}
</style>
